<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<!--[if lt IE 9]>
<script type="text/javascript" src="lib/html5shiv.js"></script>
<script type="text/javascript" src="lib/respond.min.js"></script>
<![endif]-->
<link rel="stylesheet" type="text/css" href="static/h-ui/css/H-ui.min.css" />
<link rel="stylesheet" type="text/css" href="static/h-ui.admin/css/H-ui.admin.css" />
<link rel="stylesheet" type="text/css" href="lib/Hui-iconfont/1.0.8/iconfont.css" />
<link rel="stylesheet" type="text/css" href="static/h-ui.admin/skin/default/skin.css" id="skin" />
<link rel="stylesheet" type="text/css" href="static/h-ui.admin/css/style.css" />
<!--[if IE 6]>
<script type="text/javascript" src="lib/DD_belatedPNG_0.0.8a-min.js" ></script>
<script>DD_belatedPNG.fix('*');</script>
<![endif]-->
<title>胆箱实时状态监控-票务室(票胆间)</title>
<style>
	
	.table td{
		 white-space: nowrap;
	}
	
	.classTh{
		white-space: nowrap;
	}
	
</style>
</head>
<body>
<nav class="breadcrumb"><i class="Hui-iconfont">&#xe67f;</i> 首页
	<span class="c-gray en">&gt;</span>
	统计分析
	<span class="c-gray en">&gt;</span>
	胆箱实时状态监控-票务室(票胆间)
	<a class="btn btn-success radius r" style="line-height:1.6em;margin-top:3px" href="javascript:location.replace(location.href);" title="刷新" ><i class="Hui-iconfont">&#xe68f;</i></a>
</nav>
<div class="page-container">
	<div class="text-c" id="app"> 
		<!-- 字典名称:
		<input type="text" class="input-text" id="" name="" style="width:150px"> -->
		<!-- <span> 日期范围：
		<input type="text" onfocus="WdatePicker({ maxDate:'#F{$dp.$D(\'logmax\')||\'%y-%M-%d\'}' })" id="logmin" class="input-text Wdate" style="width:120px;">
		-
		<input type="text" onfocus="WdatePicker({ minDate:'#F{$dp.$D(\'logmin\')}',maxDate:'%y-%M-%d' })" id="logmax" class="input-text Wdate" style="width:120px;"> -->
		</span>
		分公司:
		<span class="select-box inline">
		<select class="select" id="comId" name="comId">
			<option value="">请选择分公司</option>
			<!-- <c:foreach item="${company}" var="company" varstatus="status">
				
				<option value="${company.companyId}" ${params.firstValue == company.companyId ? 'selected="selected"' : ''}> ${company.companyName} </option>
				
			</c:foreach> -->
		</select>
		</span>
	 	票务室:
		<span class="select-box inline">
		<select class="select" id="toId" name="toId">
			<option value="">请选择票务室</option>
		</select> 
		</span>
		钱胆类型:
		<span class="select-box inline">
		<select class="select" id="step" name="step">
			<option value="">请选择钱胆类型</option>
			<option value="C">钱胆</option>
			<option value="R">款包</option>
		</select>
		</span>
		<!-- <input type="text" name="cashboxId" id="cashboxId" placeholder="钱胆ID（非必填）" style="width:250px" class="input-text"> -->
		<button name="" id="" onclick="queryOffice();" class="btn btn-success" type="submit"><i class="Hui-iconfont">&#xe665;</i>查询</button>
	</div>
	<!-- <div class="cl pd-5 bg-1 bk-gray mt-20">
		<span class="l">
		
		</span>
		<span class="r">共有数据：<strong>54</strong> 条</span>
	</div> -->
	<div class="mt-20">
		
		<table id="list" style="display:blank" class="table table-border table-bordered table-hover table-bg table-sort">
		<thead>
			<tr class="text-c">
				<th id="thid" style=" white-space: nowrap"  rowspan="2">分公司</th>
				<th id="thid2" style=" white-space: nowrap"  rowspan="2">票务室</th>
				<th colspan ="2" >实胆入柜</th>
				<th rowspan="2" title="实胆运输：物流人员从场站票胆间扫码接收实胆开始到清分中心人员接收实胆之前的阶段" >实胆运输</th>
				<th rowspan="2" title="实胆清点：从清分中心扫码接收实胆开始到物流人员接收空胆之前的阶段，包含实胆清点和空胆驻场" >实胆清点</th>
				<th colspan ="2" >空胆返回</th>
				<th rowspan="2" title="在途运营：从空胆出柜上运营车开始的票胆在途运营使用阶段">在途运营</th>
				
				<th colspan ="4" >汇总</th>
			</tr>
			<tr class="text-c">
				<th title="实胆摘胆：从公交车上扫码摘胆开始到实胆进入场站胆柜之前的阶段"> 实胆摘胆</th>
				<th title="实胆入柜：从场站扫码实胆入柜开始到物流接收实胆之前的阶段">实胆入柜</th>
				<th title="空胆运输：物流人员从清分中心扫码接收空胆开始到场站票胆间接收空胆之前的阶段">空胆运输</th>
				<th title="空胆入柜：从场站票胆间扫码接收空胆开始到空胆上运营车之前的阶段">空胆入柜</th>
				
				<th>在用合计</th>
				<th>坏胆合计</th>
				<th>备胆合计</th>
				<th>在账合计</th>
			</tr>
		</thead>
		
		<tfoot>
			<tr>
				<th colspan="2" style="text-align:left">总计:</th>
				<th class="classTh"></th>
				<th class="classTh"></th>
				<th class="classTh"></th>
				<th class="classTh"></th>
				<th class="classTh"></th>
				<th class="classTh"></th>
				<th class="classTh"></th>
				<th class="classTh"></th>
				<th class="classTh"></th>
				<th class="classTh"></th>
				<th class="classTh"></th>
			</tr>
		</tfoot>
		
		</table>
		
		
		
		<table id="listR"  style="display:none"  class="table table-border table-bordered table-hover table-bg table-sort">
		<thead>
			<tr class="text-c">
				<th id="thid" style=" white-space: nowrap"  rowspan="2">分公司</th>
				<th id="thid2" style=" white-space: nowrap"  rowspan="2">票务室</th>
				<th rowspan="2"  title="实胆入柜：从场站扫码实胆入柜开始到物流接收实胆之前的阶段" >实胆入柜</th>
				<th rowspan="2" title="实胆运输：物流人员从场站票胆间扫码接收实胆开始到清分中心人员接收实胆之前的阶段" >实胆运输</th>
				<th rowspan="2" title="实胆清点：从清分中心扫码接收实胆开始到物流人员接收空胆之前的阶段，包含实胆清点和空胆驻场" >实胆清点</th>
				<th colspan ="2" >空胆返回</th>
				
				<th colspan ="4" >汇总</th>
			</tr>
			<tr class="text-c">
				<th title="空胆运输：物流人员从清分中心扫码接收空胆开始到场站票胆间接收空胆之前的阶段">空胆运输</th>
				<th title="空胆入柜：从场站票胆间扫码接收空胆开始到空胆上运营车之前的阶段">空胆入柜</th>
			
				<th>在用合计</th>
				<th>坏胆合计</th>
				<th>备胆合计</th>
				<th>在账合计</th>
			</tr>
		</thead>
		
		<tfoot>
			<tr>
				<th colspan="2" style="text-align:left">总计:</th>
				<th class="classTh"></th>
				<th class="classTh"></th>
				<th class="classTh"></th>
				<th class="classTh"></th>
				<th class="classTh"></th>
				<th class="classTh"></th>
				<th class="classTh"></th>
				<th class="classTh"></th>
				<th class="classTh"></th>
			</tr>
		
			
		</tfoot>
		
		</table>
		
	</div>
</div>
<!--_footer 作为公共模版分离出去-->
<script type="text/javascript" src="lib/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="lib/layer/2.4/layer.js"></script>
<script type="text/javascript" src="static/h-ui/js/H-ui.min.js"></script>
<script type="text/javascript" src="static/h-ui.admin/js/H-ui.admin.js"></script> <!--/_footer 作为公共模版分离出去-->
<!--请在下方写此页面业务相关的脚本-->
<script type="text/javascript" src="lib/My97DatePicker/4.8/WdatePicker.js"></script>
<script type="text/javascript" src="lib/datatables/1.10.0/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="lib/laypage/1.2/laypage.js"></script>
<script type="text/javascript" src="js/jquery.base64.js"></script>

<script type="text/javascript" src="js/vue.js" charset="utf-8"></script>

<script type="text/javascript">


$(function(){
	

 var comId;
 var toId;
 var username =window.localStorage.getItem("user_name");	
 var myArray;
 
 	$.ajax({
 		type: 'get',
 		url: report_service+'/getAllCompany',
 		/* beforeSend: function (request) {
 						request.setRequestHeader("Authorization", "Bearer " + getToken());
 					}, */
 		dataType: 'json',
 		async: false,
 		success: function(data){
 			var list =  eval('(' + data.list + ')');
 			for(var i = 0;i<list.length;i++){
 				$("#comId").append("<option value='"+list[i].companyid+"'>"+list[i].companyname+"</option>");				
 			}
 		},
 		error: function(data){
 			console.log(data.msg);
 		}
 	});
 	
 	$.ajax({
 		type: 'get',
 		url: report_service+'/getUserByname',
 		data:{
 			"username": username
 		},
 		async: false,
 		/* beforeSend: function (request) {
 						request.setRequestHeader("Authorization", "Bearer " + getToken());
 					}, */
 		dataType: 'json',
 		success: function(data){
 			console.log(""+data.list);
 			var list =  eval('(' + data.list + ')');
 			console.log(list)
 			if(list[0].officeId.indexOf("1")==0){
 				console.log("进入")
 				$("#comId").val(list[0].companyId);
 				comId = list[0].companyId;
 				/* var comLength = $("#comId option").length;
 				console.log($("#comId option[index='"+i+"']").val); */
 				
 				$.ajax({
 					type: 'get',
 					url: report_service+'/getTicktOfficeByCom',
 					/* beforeSend: function (request) {
 									request.setRequestHeader("Authorization", "Bearer " + getToken());
 								}, */
 					data:{
 						"comId":comId
 					},
 					cache:false,    
 					dataType:'json',
 					async: false,
 					success: function(data){
 						//var list = data.list;
 						var list =  eval('(' + data.list + ')');
 						for(var i=0;i<list.length;i++){
 							var option = '<option value="'+list[i].toiid+'">'+list[i].toiname+'</option>';
 							$("#toId").append(option);
 						}
 					},
 					error:function(){
 						alert("请求失败");
 					}
 				});
 				$("#toId").val(list[0].officeId);
 				toId = list[0].officeId;
 				$("#comId").attr("disabled","disabled");
 				$("#toId").attr("disabled","disabled");
 			}
 			if(list[0].officeId.indexOf("1") == -1  && list[0].companyId.indexOf("1")==0 ){
 				$("#comId").val(list[0].companyId);
 				comId = list[0].companyId;
 				$.ajax({
 					type: 'get',
 					url: report_service+'/getTicktOfficeByCom',
 					/* beforeSend: function (request) {
 									request.setRequestHeader("Authorization", "Bearer " + getToken());
 								}, */
 					data:{
 						"comId":comId
 					},
 					cache:false,    
 					dataType:'json',
 					async: false,
 					success: function(data){
 						//var list = data.list;
 						var list =  eval('(' + data.list + ')');
 						for(var i=0;i<list.length;i++){
 							var option = '<option value="'+list[i].toiid+'">'+list[i].toiname+'</option>';
 							$("#toId").append(option);
 						}
 					},
 					error:function(){
 						alert("请求失败");
 					}
 				});
 				$("#comId").attr("disabled","disabled");
 			}
 			
 			
 			
 			
 		},
 		error: function(data){
 			console.log(data.msg);
 		}
 	});
	
	queryOffice();
	
});



$("#comId").change(function(){
	$("#toId").empty();
	var comId = $(this).val();
	var targetUrl = report_service+'/getTicktOfficeByCom';
	if(comId == ''){
		//$("#toId").fadeOut("slow");
		return;
	}
	$.ajax({
		type: 'get',
		url: targetUrl,
		/* beforeSend: function (request) {
						request.setRequestHeader("Authorization", "Bearer " + getToken());
					}, */
		data:{
			"comId":comId
		},
		cache:false,    
		dataType:'json',  
		success: function(data){
			//var list = data.list;
			var list =  eval('(' + data.list + ')');
			var option2 = '<option value="">请选择票务室</option>';
			$("#toId").append(option2);
			for(var i=0;i<list.length;i++){
				var option = '<option value="'+list[i].toiid+'">'+list[i].toiname+'</option>';
				$("#toId").append(option);
			}
		},
		error:function(){
			alert("请求失败");
		}
	});
});


function queryOffice(){
	   var comId = $("#comId").val();
	   var toId = $("#toId").val();
	   var type = $("#step").val();
		$.ajax({
			type: 'post',
			url:reportForm+"reportForm/getReportFormCashboxOffice",
			data: {
			 	"companyId":comId,
				"officeId":toId,
				"type":type
				
			},
			dataType: 'json',
		 	beforeSend: function (request) {
									request.setRequestHeader("Authorization", "Bearer " + getToken());
								}, 
			success: function(data){
				dataTableRreate(data,type);
							   
							   //document.getElementById("thid").setAttribute("class","sorting");
			}, 
			error:function(data) {
				console.log(data.msg);
			},
		});
		
	}
	
	
	
	
	function dataTableRreate(data,type){
		
		if(type=="R"){
			$("#list").attr("style", "display:none;");
			$("#listR").attr("style", "display:blank;");
			$('#list').dataTable().fnDestroy();
			
			$('#listR').dataTable( {
				   data: data.stepList,
				   destroy:true,
				   columns: [
						{ data: 'companyName',   "defaultContent": "0" },
						{ data: 'officeName',   "defaultContent": "0" },
						{ data: 'stepNum5',   "defaultContent": "0"},
						{ data: 'stepNum6',   "defaultContent": "0"},
						{ data: 'stepNum7',   "defaultContent": "0"},
						{ data: 'stepNum8',"defaultContent": "0"},
						{ data: 'stepNum1',   "defaultContent": "0"},
						{ data: 'stepNum10', "defaultContent": "0"},
						{ data: 'errCashBox', "defaultContent": "0"},
						{ data: 'spareCashBox', "defaultContent": "0"},
						{ data: 'totalCashBox', "defaultContent": "0"},
					   
				   ],
				  columnDefs: [
					  {
					 "orderable": false,
					 "targets": [1,2,3,4,5,6,7,8,9]
							   },
					{
						 "targets": 0,//
						 "data": null,
						 render: function(data, type, row, meta) {
								  return '<td  >'+row.briefName+'</td>'
											
						 }
					  } 
					  ], 
					  "footerCallback": function ( row, data, start, end, display ) {
								  var api = this.api();
								  // Remove the formatting to get integer data for summation
								  var intVal = function ( i ) {
									  return typeof i === 'string' ?
										  i.replace(/[\$,]/g, '')*1 :
										  typeof i === 'number' ?
											  i : 0;
								  };
					   
								  var arr = document.getElementsByTagName("tr")
								  for ( var i=2 ;i<=10 ;i++){
										  if( api.column(i).data().length>0){
											  total1 = api
												  .column( i )
												  .data()
												  .reduce( function (a, b) {
													  return intVal(a) + intVal(b);
												  } );
										  }else{
											  total1=0;
										  }
										  $( api.column( i ).footer() ).html(
												total1
										  );
								  } 
							  }
			   } );
		}else{
			$("#list").attr("style", "display:blank;");
			$("#listR").attr("style", "display:none;");
			$('#listR').dataTable().fnDestroy();
		$('#list').dataTable( {
				   data: data.stepList,
				   //stateSave: true,
				   "lengthMenu":[10, 50, 100],
				   "pageLength": 100,
				  // "ordering": false,
				  // data2: data.companyList,
				   //使用对象数组，一定要配置columns，告诉 DataTables 每列对应的属性
				   //data 这里是固定不变的，name，position，salary，office 为你数据里对应的属性
				   destroy:true,
				   columns: [
						{ data: 'companyName',   "defaultContent": "0" },
						{ data: 'officeName',   "defaultContent": "0" },
					    { data: 'stepNum4',   "defaultContent": "0"},
						{ data: 'stepNum5',   "defaultContent": "0"},
						{ data: 'stepNum6',   "defaultContent": "0"},
						{ data: 'stepNum7',   "defaultContent": "0"},
						{ data: 'stepNum8',"defaultContent": "0"},
					    { data: 'stepNum1',   "defaultContent": "0"},
						{ data: 'stepNum3',   "defaultContent": "0"},
					/* 	{ data: 'stepNum9', "defaultContent": "0"}, */
						{ data: 'stepNum10', "defaultContent": "0"},
						{ data: 'errCashBox', "defaultContent": "0"},
						{ data: 'spareCashBox', "defaultContent": "0"},
						{ data: 'totalCashBox', "defaultContent": "0"},
					   
				   ],
				  columnDefs: [
					  {
					 "orderable": false,
					 "targets": [1,2,3,4,5,6,7,8,9,10,11,12]
					           },
					{
					     "targets": 0,//
					     "data": null,
					     render: function(data, type, row, meta) {
								  return '<td  >'+row.companyName+'</td>'
											
					     }
						
					  } 
					  ], 
					  "footerCallback": function ( row, data, start, end, display ) {
					              var api = this.api();
					              // Remove the formatting to get integer data for summation
					              var intVal = function ( i ) {
					                  return typeof i === 'string' ?
					                      i.replace(/[\$,]/g, '')*1 :
					                      typeof i === 'number' ?
					                          i : 0;
					              };
					   
								  var arr = document.getElementsByTagName("tr")
								  for ( var i=2 ;i<=12 ;i++){
										  if( api.column(i).data().length>0){
											  total1 = api
												  .column( i )
												  .data()
												  .reduce( function (a, b) {
													  return intVal(a) + intVal(b);
												  } );
										  }else{
											  total1=0;
										  }
										  $( api.column( i ).footer() ).html(
												total1
										  );
								  } 
					          }
			   } );
		}
		
		
	}	
	
</script>
</body>
</html>